<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		
		<!--  第一步.引入vue.js -->
		
		<!-- 使用cdn方式 -->
		<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
		<!-- 使用本地文件方式 -->
		<!-- <script src="vue.global.js"></script> -->
	</head>
	<body>
		<!-- 第二步.创建一个div 作为视图 -->
		<div id="app">
			{{message}}<br />
			
			姓名:{{name}} 年龄：{{age}}<br />
			
			明年年龄：{{age+1}}<br />
			
			是否成年：{{age>=18?"成年":"未成年"}}<br />
		</div>
		
		<script>
			// 第三步 ：创建一个vue的实例对象
			var app = Vue.createApp({
					data(){
						return {
							"message":"一起学习Vue!",
							"name":"张三",
							"age":18
						}
					}
			});
			
			// 第四步： 把app挂载到视图上
			var vm = app.mount("#app")
			
			
		</script>
		
	</body>
</html>
